//Limpia las etiquetas que se crean al 
limpiarBasura.push(function ()
{
	if($('.note').length)
	{
		$('.note').remove();
		$('.notep').remove();
	}
});

function showaddnote (img, area) {
			//Cada vez que se mueve o cambia el tamaño de la caja se llama a esta funcion
			imgOffset = $(img).offset();
			form_left  = parseInt(imgOffset.left) + parseInt(area.x1);
			form_top   = parseInt(imgOffset.top) + parseInt(area.y1) + parseInt(area.height)+5;

			$('#noteform').css({ left: form_left + 'px', top: form_top + 'px'});

			$('#noteform').show();

			$('#noteform').css("z-index", 10000);

			//Usamos las cookies como variable global
			$.cookie("x",area.x1);
			$.cookie("y",area.y1);
			$.cookie("ancho",area.width);
			$.cookie("alto",area.height);
			
			
	}

function cargarFoto(uuid,nFoto){
			
			//Guardamos esta informacion ya que no nos podemos fiar de la uri
			//porque la foto cambiará mientras la uri no
			$.cookie("idFoto",uuid);
			$.cookie("nFoto",nFoto);
			
			//Obtenemos la informacion de la foto y las etiquetas
	 $.getJSON("consultasAjax.php?seccion=foto&uuid="+uuid+"&nFoto="+nFoto,
		function(data)
		{
			var fotoContenedor = $("#fotoContenedor");
			var titulo = data.titulo;
  
			var foto = $("<img>");
				//foto.attr("id",uuid+"-"+nFoto);
				foto.attr("id","foto");
				foto.attr("src","/imagenes/"+data.uuid+"/"+data.nFoto+"/thumbnail");
				foto.addClass("ui-state-default ui-corner-all jquery-note");
			
			fotoContenedor.html(foto);
			fotoContenedor.fadeIn("slow");
			//Hacemos esto para que no de problema el animate de jquery, que tarda 500 ms en completar la animacion

				setTimeout(function()
				{
					//Con este array construye la lista de etiquetas
					$('#foto').imgNotes(data.apariciones);
	
					$('#foto').imgAreaSelect({ onSelectChange: showaddnote, minWidth:10,minHeight:10 });
					$('#foto').imgAreaSelect({ disable: true, hide: true });
	
					//$('.jquery-note').jQueryNotes();
				},500);
			
		});

		
}
		
$(document).ready(function() {
	cargarFoto($.url.getParam("uuid"),$.url.getParam("nFoto"));
	
	var botonAceptar = $("<a>");
		 botonAceptar.attr("href","javascript:void(0)");
		 botonAceptar.addClass("dialog_link ui-state-default ui-corner-all");
		 botonAceptar.text("Aceptar");
		 botonAceptar.hover(
					function() { $(this).addClass('ui-state-hover'); }, 
					function() { $(this).removeClass('ui-state-hover'); }
				);
				
		 botonAceptar.click(
					function() {
						appendnote({"x1":$.cookie("x"),"y1":$.cookie("y"),"height":$.cookie("alto"),"width":$.cookie("ancho"),"note":$("#NoteTexto").val(), "uuid":$.cookie("usuarioId"), "nombre":$.cookie("usuarioNombre")});
						$.get("consultasAjax.php", {"seccion":"etiquetar","id":$.cookie("idFoto"),"n":$.cookie("nFoto"),"x":$.cookie("x"),"y":$.cookie("y"),"alto":$.cookie("alto"),"ancho":$.cookie("ancho"),"texto":$("#NoteTexto").val(), "idAparicion":$.cookie("usuarioId")} );
						$('#noteform').hide();
						$('#foto').imgAreaSelect({ hide: true });
						$("#NoteTexto").val("");
						$("#buscarAmigosEtiquetar").val("");

						
					}
				);
				
	var botonCancelar = $("<a>");
		 botonCancelar.attr("href","javascript:void(0)");
		 botonCancelar.addClass("dialog_link ui-state-default ui-corner-all");
		 botonCancelar.text("Cancelar");
		 botonCancelar.hover(
					function() { $(this).addClass('ui-state-hover'); }, 
					function() { $(this).removeClass('ui-state-hover'); }
				);
				
		 botonCancelar.click(
					function() {
						$('#noteform').hide();
						$('#foto').imgAreaSelect({ hide: true });
						$('#foto').imgAreaSelect({ disable: true, hide: true });
						
						$("#buscarAmigosEtiquetar").val("");

					}
				);
	$("#listaAccionesNota").append(botonAceptar);
	$("#listaAccionesNota").append(botonCancelar);
				
            
});


